<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<meta name="renderer" content="webkit" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
	<title>注册</title>
	<link rel="stylesheet" type="text/css" href="css/themes/default/easyui.css"/>
	<link rel="stylesheet" type="text/css" href="css/themes/icon.css"/>
	<link rel="stylesheet" type="text/css" href="css/common.css" />
	<link rel="stylesheet" type="text/css" href="css/icon.css" />
    <link rel="stylesheet" type="text/css" href="css/register.css" />
	<style>
		#area select {
			width: 114px;
		}
	</style>
</head>
<body>
<div id="wrapper">
	<div class="aw-login-box">
<!--		<div class="right-bg">-->
<!--			<img th:src="@{'image/png.png'}" />-->
<!--		</div>-->
		<div class="mod-body clearfix">
			<div class="content">
				<h1 class="title" style="text-align: center;">注册</h1>
					<ul>
						<li>
							<form id="register_form" name="register_form" class="s_form" method="post" action="register">
							<table>
								<tr>
									<td class="s_form_title">
										<span>用户名</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="cn" th:value="${user!=null}?${user.cn}:''" class="easyui-textbox easyui-validatebox" placeholder="用户名" data-options="required:true,validType:'minLength[5]'"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>密码</span>
									</td>
									<td class="s_form_content">
										<input type="password" name="userPassword" class="easyui-textbox easyui-validatebox" placeholder="密码" data-options="required:true,validType:'minLength[6]'"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>真实姓名</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="sn" th:value="${user!=null}?${user.sn}:''" class="easyui-textbox easyui-validatebox" placeholder="真实姓名" data-options="required:true,validType:'minLength[2]'"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>手机号码</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="telephoneNumber" th:value="${user!=null}?${user.telephoneNumber}:''" id="telephoneNumber" class="easyui-textbox easyui-validatebox" placeholder="手机号码" data-options="required:true,validType:'mobile'"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>验证码</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="telephoneNumberV" id="telephoneNumberV" class="easyui-textbox easyui-validatebox" placeholder="手机号码" data-options="required:true,validType:'minLength[4]'"/>
										<button type="button" class="btn btn-large btn-danger" id="phoneCode" onclick="app.createsmsCode()">获取验证码</button>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>邮箱地址</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="email" th:value="${user!=null}?${user.email}:''" class="easyui-textbox easyui-validatebox" placeholder="邮箱地址" data-options="required:true,validType:'email'"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>性别</span>
									</td>
									<td class="s_form_content">
										<select id="sex" class="easyui-combobox" name="sex">
											<option value="1" th:selected="${user!=null and user.sex==1}">男</option>
											<option value="2" th:selected="${user!=null and user.sex==2}">女</option>
										</select>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>国家</span>
									</td>
									<td class="s_form_content">
										<input type="text" name="country" class="easyui-textbox" placeholder="国家" value="中国"/>
									</td>
								</tr>
								<tr>
									<td class="s_form_title">
										<span>地区</span>
									</td>
									<td class="s_form_content">
										<div id="area"></div>
<!--										<input type="text" name="province" class="easyui-textbox" placeholder="省份"/>-->
									</td>
								</tr>
							</table>
							</form>
						</li>
<!--						<li class="s_from_li">-->
<!--							<table>-->
<!--								<tr>-->
<!--									<td>-->
<!--										<span>城市</span>-->
<!--									</td>-->
<!--									<td>-->
<!--										<input type="text" name="city" class="easyui-textbox" placeholder="城市"/>-->
<!--									</td>-->
<!--								</tr>-->
<!--							</table>-->
<!--						</li>-->
						<li class="last">
							<div id="errorDiv" th:inline="text" style="height: 30px; text-align: left; color: red; margin: -20px 0 10px;">[[${error == null ? '' : error}]]</div>
							<a href="login" class="pull-left btn btn-large back">返回</a>
							<button type="button" class="pull-left btn btn-large btn-primary" onclick="register()">完成</button>
						</li>
					</ul>
			</div>
<!--			<div class="side-bar pull-left">-->
<!--				<h3>注册须知</h3>-->
<!--				<p>-->
<!--					请认真阅读以下条款，如您按下同意钮即表明您已详尽阅读并同意该等条款所述含义。本网站有权随时进行条款修改，恕不做另行通知，请会员随时浏览“注册须知”栏目，-->
<!--					如您不认可该条款，可以按不同意钮退出注册页面，（如已经注册为用户）请随时联系网站管理员取消注册，如继续使用，视为同意修改条款。-->
<!--				</p>-->
<!--			</div>-->
		</div>
	</div>
	<div class="footer_wrap">
		<p>技术支持：e2tt </p>
	</div>
</div>

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/area.js"></script>
<script type="text/javascript" src="js/Validate.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" th:inline="javascript">
	$(function() {
		var success = [[${success}]]
		if(success) {
			alert("恭喜您，注册成功！");
			window.location.href='login';
		}
		initHtml()
		$("input[name='cn']").prev().focus();
	});
	function initHtml(){
		appendArea()
		var province = [[${user!=null}?${user.province}:'0']]
		if(province!='0') {
			$("select[name='province']").val(province).change()
			var city = [[${user!=null}?${user.city}:'0']]
			$("select[name='city']").val(city).change()
		}

		$("#register_form").form("disableValidation");
	}
	/*<![CDATA[*/
	function register(){
		$("#register_form").form("enableValidation");
		if($('#register_form').form('validate')){
			var province=$("select[name='province']").val()
			var city=$("select[name='city']").val()
			if(province=='0' || city=='0'){
				$("#errorDiv").text("请选择地区");
			} else if (app.varfilysmsCode()) {
				document.register_form.submit();
			}
		}
	}
	/*]]>*/
</script>
</body>
</html>
